<table class="list">
	<tr>
		<th class="_20">Ред.</th>
		<th class="_20">Права</th>
		<th>Категория</th>
		<th class="_20">Удл.</th>
	</tr>
	{foreach $cats as $cat}
	<tr>
		<td class="center">
			<a class="cat_edit" rel="{$cat->id}" href="{$base_url}&action=cat_edit&id={$cat->id}"><img src="{$tpl_url}images/pencil.png" alt="Edit"/></a>
		</td>
		<td class="center">
			<a href="{$base_url}&action=cat_rights&id={$cat->id}"><img src="{$tpl_url}images/users.png" alt="Rights"/></a>
		</td>
		<td>
			<div class="hidden" id="cat_edit_{$cat->id}">
				<form action="{$base_url}&action=cat_save" method="post">
					<input type="hidden" name="cat[id]" value="{$cat->id}" />
					<input type="text" id="cat_title" name="cat[title]" style="width: 300px;" value="{$cat->title}" />&nbsp;<input type="submit" value="&nbsp;" class="save" />&nbsp;<input type="reset" value="&nbsp;" class="cancel" />
				</form>
			</div>
			<div class="resset" id="cat_resset_{$cat->id}">
				<a href="{$base_url}&action=news&cat={$cat->id}">{$cat->title}</a>
			</div>
		</td>
		<td class="center">
			<a onclick="if(confirm('Вы действительно желаете удалить эту категорию?\nУдаление категории приведет к удалению всех новостей в ней.')) location.href=this.href; return false;" href="{$base_url}&action=cat_delete&id={$cat->id}"><img src="{$tpl_url}images/trash.png" alt="Delete"/></a>
		</td>
	</tr>
	{/foreach}
</table>

<form action="{$base_url}&action=cat_save" method="post">
	<input type="hidden" name="cat[id]" value="" />
	<div>
		<input type="text" id="cat_title" name="cat[title]" style="width: 300px;" value="" />&nbsp;<input type="submit" value="Добавить" class="plus" />
	</div>
</form>
<script type="text/javascript">
	$('a.cat_edit').live("click", function(){
		$('#cat_edit_'+ $(this).attr('rel')).css('display', 'block');
		$('#cat_resset_'+ $(this).attr('rel')).css('display', 'none');
		return false;
	});

	$('.hidden .cancel').live("click", function(){
		var id = $(this).parent('form').children('[name="cat[id]"]').val();
		$('#cat_edit_'+ id).css('display', 'none');
		$('#cat_resset_'+ id).css('display', 'block');
	});

	$('.hidden form').live("submit", function(){
		var button = $(this).children('.save');
		var form = $(this);
		$.ajax({
			"url": $(form).attr('action'),
			"data": $(form).serialize(),
			"method": "post",
			"dataType": "json",
			beforeSend: function(){
				button.addClass('load');
			},
			success: function(data){
				$('#cat_resset_'+ data.id + ' a').html(data.title);
				$('#cat_edit_'+ data.id).css('display', 'none');
				$('#cat_resset_'+ data.id).css('display', 'block');
				button.removeClass('load');
			}
		});

		return false;
	})
</script>